<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta charset="utf-8">
  <title></title>
  <meta name="keywords" content="">
  <meta name="description" content="">
  <meta name="author" content="">
  <link rel="stylesheet" href="css/main.css">
  <link rel="stylesheet" href="css/lcommon.css">
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <!--[if lt IE 9]>
	<script src="js/html5shiv.min.js"></script>
	<script src="js/respond.min.js"></script>
<![endif]-->
  <meta name="renderer" content="webkit">
  <link rel="shortcut icon" href="favicon.ico">
</head>

<body>
  <div id="app" v-cloak v-loading="loading">
    <header id="header"></header>
    <div class="header-space"></div>
    <div class="commonHeight">
      <section class="g-crumb">
        <div class="content"><a href="">招聘</a> <a href="">活动</a> <a href="" class="blue">活动详情</a></div>
      </section>
      <section v-if="activity" class="section101">
        <div class="content">
          <div class="title hasImg">
            <img :src="activity.detail" alt="" class="img">
            <h2>{{activity.name}}</h2>
            <div class="con">
              <p>报名人数：{{activity.num}} 人</p>
              <p>状态：{{activity.status}}</p>
              <p>起止时间：{{activity.start.substring(0, 10)}}~{{activity.end.substring(0, 10)}}</p>
            </div>
            <!-- v-if="activity.status=='未开始'" -->
            <div class="operate" v-if="activity.status=='进行中' && !activity.is_join">
              <a @click="baoming" href="javascript:void(0)" class="btn">立即报名</a>
            </div>
            <div class="operate" v-else>

              <a class="btn" style="background:gray;">{{!activity.is_join?is_join_full==join_num?'报名人数已满':activity.status:'您已报名'}}</a>
            </div>
          </div>
          <div class="box" v-html="activity.content"></div>

        </div>
      </section>
    </div>

    <div v-if="baomingSuc" class="alert alert-report show">
      <div class="over-close"></div>
      <div class="box">
        <img src="images/alert101.png" alt="" class="img">
        <div class="txt">可在“我的”-“我的报名”中查看报名记录。</div>
        <a href="18.html" class="btn">我的报名</a>
        <a @click="know" href="javascript:void(0)" class="btn-cnacle js_btn-cancle">知道了</a>
      </div>
    </div>

    <footer id="footer"></footer>
  </div>
  <script src="js/jquery.min.js"></script>
  <script src="js/common.js"></script>
  <script src="js/lcommon.js"></script>
  <script src="js/slide.min.js"></script>
  <script src="js/polyfill.min.js"></script>
  <script src="js/jquery.nicescroll3.7.6.min.js"></script>
  <!-- <script src="js/main.js"></script> -->
  <script src="js/vue.js"></script>
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
  <script src="js/request.js"></script>
  <script>
    $(function () {
      $("#header").load("./lcommon/header.html");
      $("#footer").load("./lcommon/footer.html");
      $("header .menu li").eq(0).addClass('on')
    })

    var vm = new Vue({
      el: '#app',
      data: {
        loading: true,
        id: GetRequest().id || "",
        activity: undefined,
        baomingSuc: false
      },
      mounted() {
        this.getActivity()
      },
      methods: {
        getActivity: function (e, num) {
          var vm = this
          var url = "person/activity/" + this.id
          request(url, 'GET', JSON.stringify({}), function (res) {
            vm.loading = false
            vm.activity = res.data.activity
          }, function (err) {
            vm.loading = false
            vm.$message.error(err.message);
          })
        },
        baoming() {
          var vm = this
          var isLogin = lcheckLogin(vm)
          if (!isLogin) {
            return
          }
          vm.getUserInfo(function (data) {
            var url = "person/activity/join"
            var p = {
              id: vm.id,
              name: data.person_info.name,
              telephone: data.person_info.telephone
            }
            request(url, 'POST', JSON.stringify(p), function (res) {
              if (res.code == 1) {
                vm.baomingSuc = true
                vm.getActivity()
              } else {
                vm.$message.error(res.message);
              }
            }, function (err) {
              vm.$message.error(err.message);
            })
          })
        },
        getUserInfo(callback) {
          var vm = this
          var url = "person/resume/base_info"
          var p = {

          }
          request(url, 'GET', JSON.stringify(p), function (res) {
            if (res.code == 1) {
              callback(res.data)
            } else {
              vm.$message.error(res.message);
            }
          }, function (err) {
            vm.$message.error(err.responseJSON.message);
          })
        },
        know(){
          this.baomingSuc=false
          this.getActivity()
        }
      },

    })
  </script>
</body>

</html>